import FormCheck from './FormCheck';

const formData = {
  realname: '',
  age: 0,
  username: '',
  password: '',
  gender: 'male',
  occupation: '',
  hobbies: [],
  intro: ''
};

//策略模式
const validators = {
  realname: (value) => ({
    reg: value.length >= 2 && value.length <= 10,
    msg: 'Realname: 2-10'
  }),
  age: (value) => ({
    reg: !isNaN(Number(value)) && Number(value) <= 150,
    msg: 'Age: type number and max 150'
  }),
  username: (value) => ({
    reg: value.length >= 6,
    msg: 'Username: min 6'
  }),
  password: (value) => ({
    reg: value.length >= 6,
    msg: 'Password: min 6'
  }),
  gender: null,
  occupation: (value) => ({
    reg: value.length > 0,
    msg: 'Occupation: one must be selected'
  }),
  hobbies: (value) => ({
    reg: value.length > 0,
    msg: 'Hobbies: must select one'
  }),
  intro: (value) => ({
    reg: value.length > 10,
    msg: 'Introduction: min 10'
  })
};

FormCheck.create('#userForm', '.user-form', {
  formData,
  validators,
  pass(key, value) {
    console.log(key, value);
  },
  noPass(key, value, error) {
    console.log(key, value, error);
  },
  handleSubmit(formData) {
    console.log(formData);
  }
});
